<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c"  uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>${SYSTEM_NAME}</title>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/static/layuiadmin/layui/css/layui.css?v=${FILE_VERSION}" media="all">
	<link rel="stylesheet" href="${pageContext.request.contextPath}/static/layuiadmin/style/admin.css?v=${FILE_VERSION}" media="all">
	<link rel="stylesheet" href="${pageContext.request.contextPath}/static/js/zTree_v3/css/metroStyle/metroStyle.css?v=${FILE_VERSION}" type="text/css">
</head>
<body>
<div class="layui-fluid">
	<div class="layui-card">
		<div class="layui-card-header">地域参数管理</div>
		<div class="layui-card-body">
			<div class="layui-row layui-col-space10">
				<div class="layui-col-xs2">
					<div style="border: 1px solid #ccc;max-height: 550px;min-height:400px; overflow: auto;" >
						<ul id="treeRegion" class="ztree"></ul>
					</div>
				</div>

				<div class="layui-col-xs10" style="padding-left: 15px">
					<div>
						<input type="hidden" id="categoryId" >
						<div class="layui-form layer-query" >
							<div class="layui-form-item">
								<div class="layui-inline">
									<label class="layui-form-label">地域名称：</label>
									<div class="layui-input-inline">
										<input id="name" placeholder="请输入地域名称" class="layui-input">
									</div>
								</div>
								<div class="layui-inline">
									<label class="layui-form-label">地域编码:</label>
									<div class="layui-input-inline">
										<input id="cityCode" placeholder="请输入地域编码" class="layui-input"/>
									</div>
								</div>
								<div class="layui-inline">
									<button class="layui-btn layui-btn-primary layui-border-blue" onclick="reload(true)">查询</button>
								</div>
							</div>
						</div>
					</div>
					<hr class="layui-bg-green">
					<table class="layui-table" lay-filter="tableList" id="layerTable">
					</table>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/html" id="toolbar">
	<div class="layui-btn-container">
		<button class="layui-btn layui-btn-primary layui-border-blue" onclick="addLayerLocal();">新增</button>
		<button class="layui-btn layui-btn-primary layui-border-red" onclick="deleteBatch('/sys/paramRegion/del/deleteBatch');">删除</button>
		<div class="layui-btn-group" style="margin-left: 10px;">
			<button class="layui-btn layui-btn-primary layui-border-blue" onclick="initParam()">更新地域缓存</button>
			<button class="layui-btn layui-btn-primary layui-border-blue" onclick="createInitFile()">更新地域文件</button>
		</div>
	</div>
</script>
<script type="text/html" id="barDemo">
	<a class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs" lay-event="edit">编辑</a>
	<a class="layui-btn layui-btn-primary layui-border-red layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="${pageContext.request.contextPath}/static/js/common-2.0.0.js?v=${FILE_VERSION}"></script>
<script src="${pageContext.request.contextPath}/static/js/export/export.js?v=${FILE_VERSION}"></script>
<script src="${pageContext.request.contextPath}/static/layuiadmin/layui/layui.js?v=${FILE_VERSION}"></script>
<script src="${pageContext.request.contextPath}/static/js/jquery-3.3.1.min.js?v=${FILE_VERSION}"></script>
<script src="${pageContext.request.contextPath}/static/js/common/coreTree-2.0.0.js?v=${FILE_VERSION}"></script>
<script src="${pageContext.request.contextPath}/static/js/zTree_v3/js/jquery.ztree.core.js?v=${FILE_VERSION}"></script>
<script>
	var ZtreeObj;
	var table,tableIns,layer;
	layui.config({
		base: getContextPath() + '/static/layuiadmin/' //静态资源所在路径
	}).extend({
		index: 'lib/index' //主入口模块
	}).use(['table','element','layer'], function(){
		layer = layui.layer;
		table = layui.table;
		createTree();

		tableIns= table.render({ //其它参数在此省略
			elem : '#layerTable',
			even :"true",
			toolbar: '#toolbar',
			defaultToolbar: ['filter', 'exports', 'print'],
			limit: 10,
			limits: [10,20,30],
			id: 'tableList',
			url: getContextPath() + '/sys/paramRegion/list/paramRegionList',
			page:true,
			method: 'post', //如果无需自定义HTTP类型，可不加该参数
			cols:  [[ //标题栏
				{checkbox: true, fixed: true}
				,{field:'name',minWidth: 120, title:"地域名称"}
				,{field:'cityCode', width:120,title:"地域编码"}
				,{field:'zipCode', width:120,title:"邮编"}
				,{field:'level', width:120,title:"级别"}
				,{field:'shortName', width:120,title:"简称"}
				,{field:'sort', width:80,sort: true,title:"排序"}
				,{fixed: 'right', width:180, align:'center',title:"操作", toolbar: '#barDemo'}
			]],
			request: {
				pageName: 'current', //页码的参数名称，默认：page
				limitName: 'size' //每页数据量的参数名，默认：limit
			} //如果无需自定义请求参数，可不加该参数
		});

		//监听工具条
		table.on('tool(tableList)', function(obj){
			if (obj.event === 'del') {
				deleteById(obj.data,obj,'/sys/paramRegion/del/deleteById');
			} else if (obj.event === 'edit') {
				addLayer('/sys/paramRegion/edit/input', obj.data.id);
			}
		});
		//重新定义table的exportFile方法
		table.exportFile=function(e,t,fileType){
			commExportExcel(tableIns, fileType);
		};
	});

	function createTree(){
		var setting = {
			data: {
				simpleData: {
					enable: false
				}
			},
			//当前树节点不是一次性获取的，所以下面async必须为true，用于点击节点时加载数据
			async: {
				enable: true,
				url: function (treeId, treeNode) {
					return  getContextPath() + '/sys/paramRegion/list/listForTree?parentId=' + treeNode.id;
				}
			},
			callback : {
				onClick: function treeOnClick() {
					reload(true);
				}
			}
		};
		$.ajax({
			url : getContextPath() + '/sys/paramRegion/list/listForTree',
			type : "post",
			dataType : "json",
			success : function(data) {
				ZtreeObj = $.fn.zTree.init($("#treeRegion"), setting, data);
			},
			error : function(XMLHttpRequest, textStatus) {
				layer.msg(textStatus);
			}
		});
	}

	function reload(isFirstPage){
		var params= {
			where: {
				name : $('#name').val(),
				cityCode: $('#cityCode').val(),
				parentId: getSelectParentId()
			}
		};
		// 解决：翻页后下次点击树节点会查不到数据
		if(isFirstPage){
			params.page= {curr: 1}; //从第1页开始
		}
		tableIns.config.where= params.where; //用于后面导出获取查询参数
		table.reload('tableList', params);
	}

	function getSelectParentId(){
		var nodes= ZtreeObj.getSelectedNodes();
		if(nodes.length>0){
			return nodes[0].id;
		}
		return "";
	}

	function addLayerLocal(){
		var treeParentId= getSelectParentId();
		if(!treeParentId){
			layer.msg("请选择左边父类");
			return;
		}
		var url= getContextPath() +  '/sys/paramRegion/add/input?parentId=' + treeParentId;
		layer.open({
			title : "添加修改地域参数",
			type: 2,
			area: ['95%', '95%'],
			anim: 2,
			content: [url, 'yes']
		});
	}

	function initParam(){
		layer.confirm('确定要重新生成缓存吗？', function(index){
			$ajax({
				url: "/sys/paramRegion/init/initParamRegion"
			});
		});
	}

	function createInitFile(){
		layer.confirm('确定要重新生成JS文件吗？', function(index){
			$ajax({
				url: "/sys/paramRegion/init/createInitFile"
			});
		});
	}

</script>
</body>
</html>